
#container {
	position: relative;
	display: block;
	margin: auto;
	padding: 20px;

	-moz-border-radius: 15px;
	width: 95%;
	height: 90%;
	background: #b4cfe5;
}

.canvas_container {

	vertical-align: middle; 
	width: 100%; 
	/*background: #c0c0c0; */
	background: white;
	border: thin solid #a0a0a0;

}

.canvas {
	display: block;
	position: relative;

	background: white;
	border: thin solid black;
	
	margin: auto auto;
	
	height: 100%;
	width: 500px;
	
	cursor: auto;
	
}

.canvas.creating {
	cursor: crosshair;
}

.control_panel {

	/*position: absolute;*/
	display: inline-block;

	font-family: tahoma;
	font-size: 11px;

	width: 250px;	
	height: 700px;
	
	padding: 0px 10px;
	
	background: #ededed;
	border: thin solid black;
	
	overflow: auto;
	
}

.control_group {
	background: #c3d9ff;
	
	width: 90%;
	
	margin: 5px 0px;
	padding: 5px;

	display: table;
}

.control {
	font-size: 9px;
	margin: 5px 0px;
	display: table-row;
}

.control_label {
	display: table-cell;
}

.control_input {
	display: table-cell;
}

.control input {
	font-size: 9px;
	/*display: inline-block;*/
}



/********************************************************************/
/**  Object Styles **************************************************/
/********************************************************************/

.object {
	display: block;
	position: absolute;

	cursor: pointer;

	/*width: 100px;
	height: 100px;*/
	
	top: 10;
	left: 10;
	
	background: #d0d0d0;
	border: none;
}

.object.hover {

}

.object.selected {
	/* border: thin solid green; */
	cursor: move;
}

.object.ui-selecting { background: #FECA40; }
.object.ui-selected { background: #F39814; color: white; }

.object.selected .ui-resizable-handle { 
	position: absolute;
	width: 8px;
	height: 8px;
	background: #c0c0c0; 
}

.ui-resizable-se {
	right: 0px;
	bottom: 0px;
	cursor: se-resize;
}

.ui-resizable-sw {
	left: 0px;
	bottom: 0px;
	cursor: sw-resize;
}

.ui-resizable-ne {
	right: 0px;
	top: 0px;
	cursor: ne-resize;
}

.ui-resizable-nw {
	left: 0px;
	top: 0px;
	cursor: nw-resize;
}